{% extends 'blog/base.html' %} 
{% block title %}{{ category.name }} -分类文章列表{% endblock %}

{% block content %}
<section class="section">
  <div class="container">
    <h1 class="title">{{ category.name }}</h1>
    <hr />
    <!-- 文章列表 -->

    {% for post in page_obj %}
    <div class="box">
      <article class="media">
        <div class="media-content">
          <div class="content">
            <h1 class="is-size-5">
              <a href="{% url 'blog:post_detail' post.id %}"
                >{{ post.title }}</a
              >
              <!-- 如果文章是热门的，则添加一个热门标签 -->
              {% if post.is_hot %}
              <span class="tag is-warning is-normal">
                <i class="fas fa-fire"></i>
              </span>
              {% endif %}
            </h1>
            <p class="has-text-grey-light is-size-6">
              {{ post.desc | slice:":150" }} ...
            </p>
          </div>
          <nav class="level is-mobile">
            <div class="level-left">
              <a class="level-item has-text-grey-light">
                <span class="icon"><i class="fas fa-stream"></i></span>
                <span>{{ post.category }} </span>
              </a>

              <div class="level-item has-text-grey-light">
                <span class="icon"><i class="fas fa-solid fa-eye"></i></span>
                <span> {{ post.pv }} </span>
                <!-- 假设有一个浏览计数 -->
              </div>
            </div>
            <div class="level-right">
              {% for tag in post.tags.all %}
              <div class="level-item has-text-grey-light">
                <span class="tag is-light"> {{ tag.name }} </span>
              </div>
              {% endfor %}
            </div>
          </nav>
        </div>
      </article>
    </div>
    {% empty %}
    <p>没有找到相关文章。</p>
    {% endfor %}
  </div>
</section>
{% endblock %}
